Navigate.displayPanels - Code Metrics - Inspection of "display small input in panel" - nextcloud/fulltextsearch - Measure and Improve Code Quality continuously with Scrutinizer

Completed

Push — master ( 92b011...f0c529 )

by Maxence

created 2018-04-07 21:55 UTC

Navigate.displayPanels C

↳ Parent: js/navigate.js

Complexity

Conditions	7
Paths	3

Size

Total Lines

Duplication

Lines	0
Ratio	0 %

Importance

Changes	4
Bugs	0	Features	0

Metric	Value
cc	7
c	4
b	0
f	0
nc	3
nop	1
dl	0
loc	81
rs	6.5544

4 Functions

Rating	Size	Complexity
A	8	2
A	3	1
A	3	1
A	3	1

How to fix Long Method

/*
 * FullTextSearch - Full text search framework for Nextcloud
 *
 * This file is licensed under the Affero General Public License version 3 or
 * later. See the COPYING file.
 *
 * @author Maxence Lange <[email protected]>
 * @copyright 2018
 * @license GNU AGPL version 3 or any later version
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 *
 */


/** global: OCA */
/** global: _ */

const fullTextSearch = OCA.FullTextSearch.api;



var elements = {
	searchTimeout: null,
	search_input: null,
	search_submit: null,
	search_result: null,
	search_json: null
};

const Navigate = function () {

	this.init();
};

Navigate.prototype = {

	init: function () {
		var self = this;

		elements.search_input = $('#search_input');
		elements.search_submit = $('#search_submit');
		elements.search_result = $('#search_result');
		elements.search_panels = $('#search_navigation');
//		elements.search_json = $('#search_json');
		elements.divHeader = $('#search_header');

		fullTextSearch.setEntryTemplate($('#template_entry'), self);
		fullTextSearch.setResultContainer(elements.search_result);

		elements.search_input.on('input', function () {
			self.resetSearch();
			if (elements.searchTimeout === null && self.initSearch()) {
				elements.searchTimeout = _.delay(function () {
					self.initSearch();
					elements.searchTimeout = null;
				}, 3000);
			}
		});

		//
		// $(document).keypress(function (e) {
		// 	if (e.which === 13) {
		// 		self.initSearch(true);
		// 	}
		// });

		self.initPanels();
	},


	initPanels: function () {
		var self = this;

		$.ajax({
			method: 'GET',
			url: OC.generateUrl('/apps/fulltextsearch/navigation/panels')

		}).done(function (res) {
			self.displayPanels(res);
		});
	},


	displayPanels: function (data) {
		var self = this;

		var ak = Object.keys(data);
		for (var i = 0; i < ak.length; i++) {
			var title = data[ak[i]]['title'];
var obj = { };
obj['foo'] = 'bar'; // Bad
obj.foo = 'bar'; // Good
			var nav = data[ak[i]]['navigation'];
var obj = { };
obj['foo'] = 'bar'; // Bad
obj.foo = 'bar'; // Good

			var li = $('<li>', {class: (nav.options !== undefined) ? 'collapsible open' : ''});
			var aIcon = $('<a>', {
				href: '#',
				class: 'search_icon'
			});
			aIcon.text(title);

			var ul = $('<ul>');
			if (nav.options !== undefined) {

				aIcon.on('click', function () {
var funcs = [];
for (var i=0; i<10; i++) {
    funcs.push(function() {
        alert(i);
    });
}

funcs[0](); // alert(10);
funcs[1](); // alert(10);
/// ...
funcs[9](); // alert(10);
					var li = $(this).closest('li');
					if (li.hasClass('open')) {
						li.removeClass('open');
					} else {
						li.addClass('open');
					}
				});

				for (var j = 0; j < nav.options.length; j++) {
					var sub = nav.options[j];

					var subA = $('<a>', {
						href: '#',
						class: 'ulsub',
						text: sub.title
					});

					var subAInput;
					if (sub.type === 'checkbox') {
						subAInput = $('<input>', {
							class: 'search_checkbox_sub',
							type: 'checkbox',
							'data-option': sub.name
						});
						subAInput.change(function () {
var funcs = [];
for (var i=0; i<10; i++) {
    funcs.push(function() {
        alert(i);
    });
}

funcs[0](); // alert(10);
funcs[1](); // alert(10);
/// ...
funcs[9](); // alert(10);
							self.initSearch();
						});
					}

					if (sub.type === 'input') {
						subAInput = $('<input>', {
							class: 'search_input_sub search_input_sub_' + sub.size,
							type: 'text',
							placeholder: sub.placeholder,
							'data-option': sub.name
						});
						subAInput.on('input', function () {
var funcs = [];
for (var i=0; i<10; i++) {
    funcs.push(function() {
        alert(i);
    });
}

funcs[0](); // alert(10);
funcs[1](); // alert(10);
/// ...
funcs[9](); // alert(10);
							self.initSearch();
						});
					}

					ul.append($('<li>').append(subA).append(subAInput));

				}
			}

			li.append(aIcon);
			var aInput = $('<input>', {
				class: 'search_checkbox',
				type: 'checkbox',
				'data-provider': ak[i]
			});
			aInput.change(function () {
var funcs = [];
for (var i=0; i<10; i++) {
    funcs.push(function() {
        alert(i);
    });
}

funcs[0](); // alert(10);
funcs[1](); // alert(10);
/// ...
funcs[9](); // alert(10);
				self.initSearch();
			});

			li.append(aInput);
			li.append(ul);

			elements.search_panels.append(li);
		}

	},


	getProviders: function () {
		var providers = [];
		elements.search_panels.find('input').each(function () {
			if ($(this).hasClass('search_checkbox') && $(this).is(":checked")) {
				providers.push($(this).attr('data-provider'));
			}
		});

		if (providers.length === 0) {
			return 'all';
		}

		return providers;
	},


	getOptions: function () {
		var options = {};
		elements.search_panels.find('input').each(function () {

			if ($(this).hasClass('search_checkbox_sub')) {
				options[$(this).attr('data-option')] = (($(this).is(':checked')) ? '1' : '0');
			}

			if ($(this).hasClass('search_input_sub')) {
				options[$(this).attr('data-option')] = $(this).val();
			}
		});

		return options;
	},


	initSearch: function () {
		var search = elements.search_input.val();

		if (search.length < 3) {
			return false;
		}

		var providers = this.getProviders();
		var options = this.getOptions();

		this.displayProviderResults(providers);

		var request = {
			providers: providers,
			options: options,
			search: search,
			page: curr.page

		};

		fullTextSearch.search(request, this.searchResult);
		return true;
	},


	displayProviderResults: function (providers) {
		elements.search_result.children('DIV.provider_header').each(function () {
			if (providers === 'all' || providers.indexOf($(this).attr('data-id')) > -1) {
				$(this).stop().slideDown(100).fadeTo(settings.delay_provider, 1);

			} else {
				$(this).stop().fadeTo(settings.delay_provider, 0).slideUp(100);
			}
		});
	},


	resetSearch: function () {
		// if (elements.search_input.val() !== '') {
		// 	return;
		// }
	},


	searchResult: function (result) {

		if (elements.search_json !== null) {
			elements.search_json.text(JSON.stringify(result));
		}

		// console.log(JSON.stringify(result));
//			OCA.notification.onFail('Search returned no result');
//		OCA.notification.onSuccess('Search returned ' + res.meta.size + ' result(s)');

	},


	onEntryGenerated: function (entry) {
		this.deleteEmptyDiv(entry, '#line1');
		this.deleteEmptyDiv(entry, '#line2');
	},


	deleteEmptyDiv: function (entry, divId) {
		var div = entry.find(divId);
		if (div.text() === '') {
			div.remove();
		}
	}


};

OCA.FullTextSearch.Example = Navigate;


$(document).ready(function () {
	OCA.FullTextSearch.example = new Navigate();
});





1			/*
2			* FullTextSearch - Full text search framework for Nextcloud
3			*
4			* This file is licensed under the Affero General Public License version 3 or
5			* later. See the COPYING file.
6			*
7			* @author Maxence Lange <[email protected]>
8			* @copyright 2018
9			* @license GNU AGPL version 3 or any later version
10			*
11			* This program is free software: you can redistribute it and/or modify
12			* it under the terms of the GNU Affero General Public License as
13			* published by the Free Software Foundation, either version 3 of the
14			* License, or (at your option) any later version.
15			*
16			* This program is distributed in the hope that it will be useful,
17			* but WITHOUT ANY WARRANTY; without even the implied warranty of
18			* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
19			* GNU Affero General Public License for more details.
20			*
21			* You should have received a copy of the GNU Affero General Public License
22			* along with this program. If not, see <http://www.gnu.org/licenses/>.
23			*
24			*/
25
26
27			/** global: OCA */
28			/** global: _ */
29
30			const fullTextSearch = OCA.FullTextSearch.api;
			0 ignored issues – show Backwards Compatibility introduced 2018-01-10 22:09 UTC by Report Bug Copy Issue Report 'const' is available in ES6 (use 'esversion: 6') or Mozilla JS extensions (use moz). Loading history...
31
32
33			var elements = {
34			searchTimeout: null,
35			search_input: null,
36			search_submit: null,
37			search_result: null,
38			search_json: null
39			};
40
41			const Navigate = function () {
			0 ignored issues – show Backwards Compatibility introduced 2018-01-10 22:09 UTC by Report Bug Copy Issue Report 'const' is available in ES6 (use 'esversion: 6') or Mozilla JS extensions (use moz). Loading history...
42			this.init();
43			};
44
45			Navigate.prototype = {
46
47			init: function () {
48			var self = this;
49
50			elements.search_input = $('#search_input');
51			elements.search_submit = $('#search_submit');
52			elements.search_result = $('#search_result');
53			elements.search_panels = $('#search_navigation');
54			// elements.search_json = $('#search_json');
55			elements.divHeader = $('#search_header');
56
57			fullTextSearch.setEntryTemplate($('#template_entry'), self);
58			fullTextSearch.setResultContainer(elements.search_result);
59
60			elements.search_input.on('input', function () {
61			self.resetSearch();
62			if (elements.searchTimeout === null && self.initSearch()) {
63			elements.searchTimeout = _.delay(function () {
64			self.initSearch();
65			elements.searchTimeout = null;
66			}, 3000);
67			}
68			});
69
70			//
71			// $(document).keypress(function (e) {
72			// if (e.which === 13) {
73			// self.initSearch(true);
74			// }
75			// });
76
77			self.initPanels();
78			},
79
80
81			initPanels: function () {
82			var self = this;
83
84			$.ajax({
85			method: 'GET',
86			url: OC.generateUrl('/apps/fulltextsearch/navigation/panels')
			0 ignored issues – show Bug introduced 2018-02-07 00:09 UTC by Report Bug Copy Issue Report The variable `OC` seems to be never declared. If this is a global, consider adding a `/** global: OC */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
87			}).done(function (res) {
88			self.displayPanels(res);
89			});
90			},
91
92
93			displayPanels: function (data) {
94			var self = this;
95
96			var ak = Object.keys(data);
97			for (var i = 0; i < ak.length; i++) {
98			var title = data[ak[i]]['title'];
			0 ignored issues – show Coding Style introduced 2018-02-07 00:09 UTC by Report Bug Copy Issue Report `['title']` could be written in dot notation. You can rewrite this statement in dot notation: var obj = { }; obj['foo'] = 'bar'; // Bad obj.foo = 'bar'; // Good Loading history...
99			var nav = data[ak[i]]['navigation'];
			0 ignored issues – show Coding Style introduced 2018-02-07 00:09 UTC by Report Bug Copy Issue Report `['navigation']` could be written in dot notation. You can rewrite this statement in dot notation: var obj = { }; obj['foo'] = 'bar'; // Bad obj.foo = 'bar'; // Good Loading history...
100
101			var li = $('<li>', {class: (nav.options !== undefined) ? 'collapsible open' : ''});
102			var aIcon = $('<a>', {
103			href: '#',
104			class: 'search_icon'
105			});
106			aIcon.text(title);
107
108			var ul = $('<ul>');
109			if (nav.options !== undefined) {
110
111			aIcon.on('click', function () {
			0 ignored issues – show Bug introduced 2018-04-06 15:43 UTC by Report Bug Copy Issue Report It is generally not recommended to make functions within a loop. While making functions in a loop will not lead to any runtime error, the code might not behave as you expect as the variables in the scope are not imported by value, but by reference. Let’s take a look at an example: var funcs = []; for (var i=0; i<10; i++) { funcs.push(function() { alert(i); }); } funcs[0](); // alert(10); funcs[1](); // alert(10); /// ... funcs[9](); // alert(10); If you would instead like to bind the function inside the loop to the value of the variable during that specific iteration, you can create the function from another function: var createFunc = function(i) { return function() { alert(i); }; }; var funcs = []; for (var i=0; i<10; i++) { funcs.push(createFunc(i)); } funcs[0](); // alert(0) funcs[1](); // alert(1) // ... funcs[9](); // alert(9) Loading history...
112			var li = $(this).closest('li');
113			if (li.hasClass('open')) {
114			li.removeClass('open');
115			} else {
116			li.addClass('open');
117			}
118			});
119
120			for (var j = 0; j < nav.options.length; j++) {
121			var sub = nav.options[j];
122
123			var subA = $('<a>', {
124			href: '#',
125			class: 'ulsub',
126			text: sub.title
127			});
128
129			var subAInput;
130			if (sub.type === 'checkbox') {
131			subAInput = $('<input>', {
132			class: 'search_checkbox_sub',
133			type: 'checkbox',
134			'data-option': sub.name
135			});
136			subAInput.change(function () {
			0 ignored issues – show Bug introduced 2018-04-07 17:26 UTC by Report Bug Copy Issue Report It is generally not recommended to make functions within a loop. While making functions in a loop will not lead to any runtime error, the code might not behave as you expect as the variables in the scope are not imported by value, but by reference. Let’s take a look at an example: var funcs = []; for (var i=0; i<10; i++) { funcs.push(function() { alert(i); }); } funcs[0](); // alert(10); funcs[1](); // alert(10); /// ... funcs[9](); // alert(10); If you would instead like to bind the function inside the loop to the value of the variable during that specific iteration, you can create the function from another function: var createFunc = function(i) { return function() { alert(i); }; }; var funcs = []; for (var i=0; i<10; i++) { funcs.push(createFunc(i)); } funcs[0](); // alert(0) funcs[1](); // alert(1) // ... funcs[9](); // alert(9) Loading history...
137			self.initSearch();
138			});
139			}
140
141			if (sub.type === 'input') {
142			subAInput = $('<input>', {
143			class: 'search_input_sub search_input_sub_' + sub.size,
144			type: 'text',
145			placeholder: sub.placeholder,
146			'data-option': sub.name
147			});
148			subAInput.on('input', function () {
			0 ignored issues – show Bug introduced 2018-04-07 21:57 UTC by Report Bug Copy Issue Report It is generally not recommended to make functions within a loop. While making functions in a loop will not lead to any runtime error, the code might not behave as you expect as the variables in the scope are not imported by value, but by reference. Let’s take a look at an example: var funcs = []; for (var i=0; i<10; i++) { funcs.push(function() { alert(i); }); } funcs[0](); // alert(10); funcs[1](); // alert(10); /// ... funcs[9](); // alert(10); If you would instead like to bind the function inside the loop to the value of the variable during that specific iteration, you can create the function from another function: var createFunc = function(i) { return function() { alert(i); }; }; var funcs = []; for (var i=0; i<10; i++) { funcs.push(createFunc(i)); } funcs[0](); // alert(0) funcs[1](); // alert(1) // ... funcs[9](); // alert(9) Loading history...
149			self.initSearch();
150			});
151			}
152
153			ul.append($('<li>').append(subA).append(subAInput));
			0 ignored issues – show Bug introduced 2018-04-07 21:57 UTC by Report Bug Copy Issue Report The variable `subAInput` seems to not be initialized for all possible execution paths. Are you sure `append` handles `undefined` variables? Loading history...
154			}
155			}
156
157			li.append(aIcon);
158			var aInput = $('<input>', {
159			class: 'search_checkbox',
160			type: 'checkbox',
161			'data-provider': ak[i]
162			});
163			aInput.change(function () {
			0 ignored issues – show Bug introduced 2018-04-07 17:26 UTC by Report Bug Copy Issue Report It is generally not recommended to make functions within a loop. While making functions in a loop will not lead to any runtime error, the code might not behave as you expect as the variables in the scope are not imported by value, but by reference. Let’s take a look at an example: var funcs = []; for (var i=0; i<10; i++) { funcs.push(function() { alert(i); }); } funcs[0](); // alert(10); funcs[1](); // alert(10); /// ... funcs[9](); // alert(10); If you would instead like to bind the function inside the loop to the value of the variable during that specific iteration, you can create the function from another function: var createFunc = function(i) { return function() { alert(i); }; }; var funcs = []; for (var i=0; i<10; i++) { funcs.push(createFunc(i)); } funcs[0](); // alert(0) funcs[1](); // alert(1) // ... funcs[9](); // alert(9) Loading history...
164			self.initSearch();
165			});
166
167			li.append(aInput);
168			li.append(ul);
169
170			elements.search_panels.append(li);
171			}
172
173			},
174
175
176			getProviders: function () {
177			var providers = [];
178			elements.search_panels.find('input').each(function () {
179			if ($(this).hasClass('search_checkbox') && $(this).is(":checked")) {
180			providers.push($(this).attr('data-provider'));
181			}
182			});
183
184			if (providers.length === 0) {
185			return 'all';
186			}
187
188			return providers;
189			},
190
191
192			getOptions: function () {
193			var options = {};
194			elements.search_panels.find('input').each(function () {
195
196			if ($(this).hasClass('search_checkbox_sub')) {
197			options[$(this).attr('data-option')] = (($(this).is(':checked')) ? '1' : '0');
198			}
199
200			if ($(this).hasClass('search_input_sub')) {
201			options[$(this).attr('data-option')] = $(this).val();
202			}
203			});
204
205			return options;
206			},
207
208
209			initSearch: function () {
210			var search = elements.search_input.val();
211
212			if (search.length < 3) {
213			return false;
214			}
215
216			var providers = this.getProviders();
217			var options = this.getOptions();
218
219			this.displayProviderResults(providers);
220
221			var request = {
222			providers: providers,
223			options: options,
224			search: search,
225			page: curr.page
			0 ignored issues – show Bug introduced 2018-01-10 22:09 UTC by Report Bug Copy Issue Report The variable `curr` seems to be never declared. If this is a global, consider adding a `/** global: curr */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
226			};
227
228			fullTextSearch.search(request, this.searchResult);
229			return true;
230			},
231
232
233			displayProviderResults: function (providers) {
234			elements.search_result.children('DIV.provider_header').each(function () {
235			if (providers === 'all' \|\| providers.indexOf($(this).attr('data-id')) > -1) {
236			$(this).stop().slideDown(100).fadeTo(settings.delay_provider, 1);
			0 ignored issues – show Bug introduced 2018-04-07 17:26 UTC by Report Bug Copy Issue Report The variable `settings` seems to be never declared. If this is a global, consider adding a `/** global: settings */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
237			} else {
238			$(this).stop().fadeTo(settings.delay_provider, 0).slideUp(100);
239			}
240			});
241			},
242
243
244			resetSearch: function () {
245			// if (elements.search_input.val() !== '') {
246			// return;
247			// }
248			},
249
250
251			searchResult: function (result) {
252
253			if (elements.search_json !== null) {
254			elements.search_json.text(JSON.stringify(result));
255			}
256
257			// console.log(JSON.stringify(result));
258			// OCA.notification.onFail('Search returned no result');
259			// OCA.notification.onSuccess('Search returned ' + res.meta.size + ' result(s)');
260
261			},
262
263
264			onEntryGenerated: function (entry) {
265			this.deleteEmptyDiv(entry, '#line1');
266			this.deleteEmptyDiv(entry, '#line2');
267			},
268
269
270			deleteEmptyDiv: function (entry, divId) {
271			var div = entry.find(divId);
272			if (div.text() === '') {
273			div.remove();
274			}
275			}
276
277
278			};
279
280			OCA.FullTextSearch.Example = Navigate;
281
282
283			$(document).ready(function () {
284			OCA.FullTextSearch.example = new Navigate();
285			});
286
287
288
289

nextcloud / fulltextsearch

Push — master ( 92b011...f0c529 )

Navigate.displayPanels C

Complexity

Size

Duplication

Importance

4 Functions

How to fix Long Method

Long Method

Duplication Side-by-Side

Filter issues like